body{
	padding: 20px
}
#container{
	width: 640px;
	height: 400px;
	border: 3px solid #333;
	overflow: hidden;
	position: relative;
}
#container a{
	text-decoration: none;
}
#list{
	width: 5120px;
	height: 400px;
	position: absolute;
	z-index: 1;
}
#list img{
	float: left;
	width: 315px;
	height: 400px;
}

#list span{
	display: inline-block;
	width: 636px;
	height: 400px;
}

#buttons{
	position: absolute;
	height: 10px;
	width: 160px;
	z-index: 2;
	bottom: 20px;
	left: 270px;
}
#buttons span{
	cursor: pointer;
	float: left;
	border: 1px solid #fff;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #333;
	margin-right: 5px;
}
#buttons .on{
	background: orangered;
}
.arrow{
	cursor: pointer;
	display: none;
	line-height: 39px;
	text-align: center;
	font-size: 36px;
	font-weight: bold;
	width: 40px;
	position: absolute;
	z-index: 2;
	top: 180px;
	background-color: rgba(0,0,0,.3);
	color: #fff;
}
.arrow:hover{
	background-color: rgba(0,0,0,.7);
}
#container:hover .arrow{
	display: block;
}
#prev{
	left: 20px;
}
#next{
	right: 20px;
}
.list-left{
	border-right: 2px solid #eee;
	margin: 0px 2px;
}